<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>

<div id="app">
  <form>
    <label>用户名</label>
    <input type="text" v-model="userinfo.username">
    <br>
    <label>手机号</label>
    <input  v-model="userinfo.phone" type="text">
    <br>
    <label>密码</label>
    <input v-model="userinfo.pwd" type="password">
    <br>
    <label>性别</label>
    <input type="radio" v-model="userinfo.sex">男
    <input type="radio" v-model="userinfo.sex">女
    <input type="radio" v-model="userinfo.sex">未知
    <br>
    <label>爱好</label>
    <input type="checkbox">写代码
    <input type="checkbox">跑步
    <input type="checkbox">看书
    <input type="checkbox">游泳
    <br>
    <label>出生地</label>
    <select>
      <option>-请选择-</option>
      <option>西安</option>
      <option>渭南</option>
      <option>汉中</option>
    </select>
    <br>
    <label>签名</label>
    <textarea></textarea>
    <br>
    <button>提交</button>
  </form>
</div>

<script src="./vue.js"></script>
<script>
  const app = new Vue({
    data: {
      userinfo: {
        username: '',
        pwd: '',
        phone: '',
        sex: '',
        aihao: [],
        city: '',
        desc: ''
      }
    }
  })
</script>

</body>
</html>